#@head() 
#@header()
<title>客户列表</title>
#@aside("auxiliary")
<script type="text/javascript" src="#(path)/assets/js/jquery.tmpl.min.js"></script>
<style>
	.box-body{padding:5px !important}
</style>
<div class="content-wrapper">
	<section class="content">
	<div class="nav-tabs-custom">
		<ul class="nav nav-tabs">
			<li class="active"><a href="#(path)/admin/page/auxiliary-backlog" >后台操作日志</a></li>
		</ul>
		<div class="tab-content">
			<div class="tab-pane active" id="tab_1">
					<label style="float:left;margin-top:17px;margin-left:20px;">时间区间:</label>
					<input type="text" id="startime" class="form-control" onClick="WdatePicker()" style="width:120px;float:left;margin-top:10px;margin-left:10px;">
					<span style="float:left;margin:15px 5px 0 5px;">—</span>
					<input type="text" id="endtime" class="form-control" onClick="WdatePicker()" style="width:120px;float:left;margin-top:10px;margin-right:20px;">
					<label style="float:left;margin-top:17px;margin-left:20px;">角色:</label>
					<div class="input-group margin" style="width:120px;;float:left">
						<select id="selerole" class="form-control">
						  <option value ="">全部</option>
						  <option value ="admin">管理员</option>
						  <option value ="agent">普通客服</option>
						  <option value="agent_leader">客服组长</option>
						  <option value="agent_manager">客服主管</option>
						  <option value ="assets_create">资产发布</option>
						  <option value ="assets_first">资产一审</option>
						  <option value="assets_second">资产终审</option>
						  <option value="product">营销管理</option>
						</select>
					</div>
					
					<div class="input-group margin" style="width:35%;float:left">
						<input type="text" id="usermobile" class="form-control" placeholder="输入用户号码" >
						<span class="input-group-btn">
						  <button id="seachuser" type="button" class="btn btn-info btn-flat">搜索</button>
						</span>
					</div>
				<div class="box-body">
					<table  id="example1" class="table table-striped">
						<thead>
							<tr>
								<th>编号ID</th>
								<th>操作内容</th>
								<th>操作详情</th>
								<th>操作时间</th>
								<th>用户号码</th>
								<th>用户姓名</th>
								<th>用户角色</th>
							</tr>
						</thead>
						<tbody id="userlist">
							
						</tbody>
					</table>
					<div class="box-footer clearfix">
					  <ul class="pagination pagination-sm no-margin pull-right">
						<li id="userlist1"><a href="#">首页</a></li>
						<li id="userlist2"><a href="#">上一页</a></li>
						<li><a href="#">第<span id="userlist5"></span>页 共<span id="userlist6"></span>页</a></li>
						<li id="userlist3"><a href="#">下一页</a></li>
						<li id="userlist4"><a href="#">尾页</a></li>
					  </ul>
					</div>
				</div>
			</div>
		</div>
	</div>
	</section>
</div>
#@footer()
<script id="userlistall" type="text/x-jquery-tmpl">
	<tr>
		<td>${id}</td>
		<td>${name}</td>
		<td>${contents}</td>
		<td>${create_time}</td>
		<td>${mobile}</td>
		<td>${real_name}</td>
		<td>${role}</td>
	</tr>
</script>
<script>
 $(document).ready(function(){
		var totalPage = 1;
		var pageNumber = 1;
		var usermobile = "";
		var seleinfo = "";
		var startime = "";
		var endtime = "";
		pageNumber = 1;
		$("#userlist").empty();
		userlist(1,usermobile,seleinfo,endtime,startime);
		$("#userlist5").html(pageNumber);
		$("#userlist1").click(function(){
			$("#userlist").empty();
			userlist(1,usermobile,seleinfo,endtime,startime);
			pageNumber = 1;
			$("#userlist5").html(pageNumber);
		});
		$("#userlist2").click(function(){
			if(pageNumber==1){
				alert("当前页是首页!");
			}else{
				$("#userlist").empty();
				pageNumber = pageNumber-1;

				userlist(pageNumber,usermobile,seleinfo,endtime,startime);
				$("#userlist5").html(pageNumber);
				}
			});
		$("#userlist3").click(function(){
			if(pageNumber==$("#userlist6").html()){ 
				alert("当前页是尾页!");
			}else{
			$("#userlist").empty();
				pageNumber = pageNumber +1;
				userlist(pageNumber,usermobile,seleinfo,endtime,startime);
				$("#userlist5").html(pageNumber);
				}
			});
		$("#userlist4").click(function(){
			$("#userlist").empty();
			userlist(totalPage,usermobile,seleinfo,endtime,startime);
			pageNumber = totalPage;
			$("#userlist5").html(pageNumber);
		});
		$("#seachuser").click(function(){
			$("#userlist").empty();
			usermobile = $("#usermobile").val();
			endtime = $("#endtime").val();
			startime = $("#startime").val();
			seleinfo = $("#selerole").val(); 
			userlist(1,usermobile,seleinfo,endtime,startime);
			$("#userlist5").html(1); 
		});
		function userlist(page,usermobile,seleinfo,endtime,startime){
			$.getJSON("/logger/list?token=#(session.token??)&page="+page+"&size=12&type=backend&createTimeEnd="+endtime+"&mobile="+usermobile+"&role="+seleinfo+"&createTimeStart="+startime, function(userli) {
				if(userli.code=='success'){
					totalPage = userli.data.page.totalPage; 
					var userli = userli.data.page;
					$("#userlist6").html(totalPage);
					$.each(userli.list, function(i, item){ 
						var userlist = {role:item.role,contents:item.contents,id:item.id,real_name:item.real_name,name:item.name,mobile:item.mobile,create_time:item.create_time};
						$("#userlistall").tmpl(userlist).appendTo('#userlist');
					});
				}else if(userli.code=='unauth'){
					layer.msg('您无权限访问该界面！',{icon:2});
				}
			});	
		}
});
   
</script> 


</body>
</html>

